<template>
    <basic-container>
        <avue-crud :option="option"
                   :table-loading="loading"
                   :data="data"
                   v-model:page="page"
                   v-model:search="search"
                   :permission="permissionList"
                   :before-open="beforeOpen"
                   v-model="form"
                   ref="crud"
                   @row-update="rowUpdate"
                   @row-save="rowSave"
                   @row-del="rowDel"
                   @search-change="searchChange"
                   @sort-change="sortChange"
                   @search-reset="searchReset"
                   @selection-change="selectionChange"
                   @current-change="currentChange"
                   @size-change="sizeChange"
                   @refresh-change="refreshChange"
                   @on-load="onLoad"
                   :summary-method="summaryMethod">
            <template #menu-left>
                <el-button
                        type="warning"
                        icon="el-icon-download"
                        @click="handleExport"
                >导出
                </el-button>
            </template>

<!--            <template #idNo="scope">-->
<!--                <a @click="handleView(scope.row)" href="#">{{scope.row.idNo}}</a>-->
<!--            </template>-->

            <template #salesDate-search="{ disabled, size }">
                <!--<div style="display: flex;flex-direction: start;">-->
                    <!--<el-select v-model="query.salesDateRule" placeholder="比较" filterable clearable>-->
                        <!--<el-option label="" value=""></el-option>-->
                        <!--<el-option value=">" label="大于">大于</el-option>-->
                        <!--<el-option value=">=" label="大于等于">大于等于</el-option>-->
                        <!--<el-option value="=" label="等于">等于</el-option>-->
                        <!--<el-option value="!=" label="不等于">不等于</el-option>-->
                        <!--<el-option value="<=" label="小于等于">小于等于</el-option>-->
                        <!--<el-option value="<" label="小于">小于</el-option>-->
                    <!--</el-select>-->
                    <!--<el-date-picker-->
                            <!--size="default"-->
                            <!--v-model="query.salesDateSearch"-->
                            <!--type="date"-->
                            <!--:format="dateFormat"-->
                            <!--:value-format="dateFormat"-->
                            <!--:unlink-panels="true"-->
                            <!--clearable-->
                            <!--placeholder="订单日期"-->
                            <!--:picker-options="pickerOptions"-->
                    <!--&gt;-->
                    <!--</el-date-picker>-->
                <!--</div>-->
                <el-date-picker
                        size="default"
                        style="width:94%"
                        v-model="this.salesDateRange"
                        type="daterange"
                        :format="dateFormat"
                        :value-format="dateFormat"
                        unlink-panels
                        start-placeholder="Start Date"
                        end-placeholder="End Date"
                        clearable
                        placeholder="订单日期"
                        @change="handleDateChange"
                        :picker-options="pickerOptions"
                >
                </el-date-picker>
            </template>

            <template #menu="{ row, size, type }">
                <el-tooltip content="查看订单进度" placement="top">
                    <el-button
                            icon="el-icon-view"
                            link
                            :size="size"
                            :type="type"
                            @click="() => handleView(row)"
                    >
                    </el-button>
                </el-tooltip>
            </template>

        </avue-crud>
        <order-progress  ref="orderProgress" @success="refreshChange()"/>
    </basic-container>
</template>

<script>
    import {orderDetails, getDetail, add, update, remove} from "@/api/anwise/order/order_item";
    import {mapGetters} from "vuex";
    import website from '@/config/website';
    import { getToken } from '@/utils/auth';
    import { exportBlob } from '@/api/common';
    import { downloadXls } from '@/utils/util';
    import NProgress from 'nprogress';
    import 'nprogress/nprogress.css';
    import orderProgress from './components/order_progress.vue';
    import {selectCustomerGroup} from "@/api/anwise/material/customer_group";

    export default {
        components: {
            orderProgress,
        },
        data() {
            return {
                form: {},
                query: {},
                search:{},
                salesDateRange:[],
                loading: true,
                page: {
                    pageSize: 20,
                    currentPage: 1,
                    total: 0
                },
                selectionList: [],
                dateFormat: 'YYYY-MM-DD',
                pickerOptions: {},
                programCodeSelect:[],
                option: {
                    height:'auto',
                    calcHeight: 30,
                    tip: false,
                    searchShow: false,
                    searchMenuSpan: 6,
                    border: true,
                    index: true,
                    selection: false,
                    reserveSelection:true,
                    labelWidth: 150,
                    indexWidth:100,
                    menuWidth: 100,
                    addBtn: false,
                    editBtn: false,
                    viewBtn: false,
                    delBtn: false,
                    stripe: true,
                    searchIndex: 3,
                    searchIcon: false,
                    searchLabelWidth:140,
                    searchEnter:true,
                    showSummary: true,
                    menu:true,
                    column: [
                        {
                            label: "Order Status",
                            prop: "orderStatus",
                            type: "select",
                            filterable: true,
                            fixed: true,
                            dicUrl: '/api/blade-system/dict-biz/dictionary?code=order_status',
                            props: {
                                label: 'dictValue',
                                value: 'dictKey',
                            },
                            dataType: 'string',
                            search: true,
                            sortable: true,
                            overHidden: true,
                            width:140,
                        },
                        {
                            label: "Order Date",
                            prop: "salesDate",
                            type: "date",
                            search: true,
                            fixed: true,
                            overHidden: true,
                            sortable: true,
                            width:140,
                            valueFormat: 'YYYY-MM-DD',
                            format:'YYYY-MM-DD',
                        },
                      {
                        label: "Order Category",
                        prop: "orderType",
                        type: "select",
                        search: true,
                        overHidden: true,
                        sortable: true,
                        fixed: true,
                        width:120,
                        dicUrl: '/api/blade-system/dict-biz/dictionary?code=order_type',
                        props: {
                          label: 'dictValue',
                          value: 'dictKey',
                        },
                        dataType: 'string',
                      },
                        {
                            label: "Order No.",
                            prop: "idNo",
                            type: "input",
                            fixed: true,
                            search: true,
                            overHidden: true,
                            sortable: true,
                            width:140,
                            rules: [{
                                required: true,
                                message: "请输入订单编号",
                                trigger: "blur"
                            }],
                        },
                        {
                            label: "Customer PO",
                            prop: "custPo",
                            type: "input",
                            search: true,
                            overHidden: true,
                            sortable: true,
                            width:150,
                        },
                        {
                            label: "Item",
                            prop: "itemNo",
                            type: "number",
                            precision:0,
                            min:1,
                            controls:false,
                            search: true,
                            overHidden: true,
                            sortable: true,
                            width:140,
                        },
                        {
                            label: "Customer Code",
                            prop: "customerNo",
                            type: "input",
                            search: true,
                            overHidden: true,
                            sortable: true,
                            width:160,
                        },
                        {
                            label: "Customer Name",
                            prop: "customerName",
                            type: "input",
                            search: true,
                            overHidden: true,
                            sortable: true,
                            width:180,
                        },
                        {
                            label: "Material Code",
                            prop: "materialNo",
                            type: "input",
                            search: true,
                            overHidden: true,
                            sortable: true,
                            width:180,
                        },
                        {
                            label: "Product Code",
                            prop: "barCode",
                            type: "input",
                            search: true,
                            overHidden: true,
                            sortable: true,
                            width:180,
                        },
                        {
                            label: "Material Name",
                            prop: "materialName",
                            type: "input",
                            search: true,
                            overHidden: true,
                            sortable: true,
                            width:180,
                        },
                        {
                            label: "Order Qty",
                            prop: "num",
                            type: "input",
                            overHidden: true,
                            sortable: true,
                            width:140,
                        },
                        {
                            label: "Unit",
                            prop: "unit",
                            type: "input",
                            overHidden: true,
                            sortable: true,
                            width:140,
                        },
                        {
                            label: "Currency",
                            prop: "rmb",
                            type: "input",
                            overHidden: true,
                            sortable: true,
                            width:140,
                        },
                        {
                            label: "Price/100pcs",
                            prop: "checkPriceNum",
                            type: "input",
                            overHidden: true,
                            sortable: true,
                            width:140,
                        },
                        {
                            label: "Amount",
                            prop: "checkTotalPrice",
                            type: "input",
                            overHidden: true,
                            sortable: true,
                            width:140,
                        },
                        {
                            label: "Shipped Qty",
                            prop: "deliNum",
                            type: "input",
                            overHidden: true,
                            sortable: true,
                            width:150,
                        },
                        {
                            label: "Unshipped Qty",
                            prop: "needNum",
                            type: "input",
                            overHidden: true,
                            sortable: true,
                            width:160,
                        },
                        {
                            label: "ASN Qty",
                            prop: "asnNum",
                            type: "input",
                            overHidden: true,
                            sortable: true,
                            width:160,
                        },
                        {
                            label: "NON-ASN Qty",
                            prop: "unAsnNum",
                            type: "input",
                            overHidden: true,
                            sortable: true,
                            width:160,
                        },
                        {
                            label: "Goods Ready Date \n" +
                                "ex-fty",
                            prop: "deliDate",
                            type: "input",
                            overHidden: true,
                            sortable: true,
                            width:155,
                        },{
                            label: "Pcs/Ctn",
                            prop: "maxNum",
                            type: "input",
                            // search: true,
                            overHidden: true,
                            width:140,
                        },{
                            label: "G.W./Ctn",
                            prop: "cost",
                            type: "input",
                            // search: true,
                            overHidden: true,
                            width:140,
                        },{
                            label: "cbm/Ctn",
                            prop: "packSize",
                            type: "input",
                            // search: true,
                            overHidden: true,
                            width:140,
                        },
                      {
                        label: "L*W*H(m)",
                        prop: "packContent",
                        type: "input",
                        overHidden: true,
                        sortable: true,
                        width:150,
                      },
                      {
                            label: "Total Ctn",
                            prop: "totalCtn",
                            type: "input",
                            // search: true,
                            overHidden: true,
                            width:140,
                            formatter:(val,value,label)=>{
                                if (val.num && val.maxNum && val.num!=0 && val.maxNum!=0) {
                                    val.totalCtn = Math.ceil(val.num/val.maxNum);
                                    return Math.ceil(val.num/val.maxNum);
                                } else {
                                    val.totalCtn = '';
                                    return ''
                                }
                            },
                        },{
                            label: "Total G.W.",
                            prop: "totalGw",
                            type: "input",
                            // search: true,
                            overHidden: true,
                            width:140,
                            formatter:(val,value,label)=>{
                                if (val.num && val.maxNum && val.cost && val.num!=0 && val.maxNum!=0 && val.cost!=0) {
                                    val.totalGw= this.$toFixed(Math.ceil(val.num/val.maxNum) * val.cost,2);
                                    return this.$toFixed(Math.ceil(val.num/val.maxNum) * val.cost,2);
                                } else {
                                    val.totalGw= '';
                                    return ''
                                }
                            },
                        },{
                            label: "Total CBM",
                            prop: "packSizeCbm",
                            type: "input",
                            // search: true,
                            overHidden: true,
                            width:140,
                            formatter:(val,value,label)=>{
                                if (val.num && val.maxNum && val.packSize&& val.num!=0 && val.maxNum!=0 && val.packSize!=0) {
                                    val.packSizeCbm = this.$toFixed(Math.ceil(val.num/val.maxNum) * val.packSize,2);
                                    return this.$toFixed(Math.ceil(val.num/val.maxNum) * val.packSize,2);
                                } else {
                                    val.packSizeCbm = '';
                                    return ''
                                }
                            },
                        }, {
                            label: "Pcs/Inner ctn",
                            prop: "minNum",
                            type: "input",
                            // search: true,
                            overHidden: true,
                            width:140,
                        },
                        {
                            label: "Pcs/Bag",
                            prop: "saveNum",
                            type: "input",
                            // search: true,
                            overHidden: true,
                            width:140,
                        },{
                            label: "Packing Remark",
                            prop: "packRemark",
                            type: "input",
                            // search: true,
                            overHidden: true,
                            width:150,
                        },
                        {
                            label: "CS",
                            prop: "serviceName",
                            type: "input",
                            search: true,
                            overHidden: true,
                            sortable: true,
                            width:140,
                        },
                        {
                            label: "Program",
                            prop: "programName",
                            type: "select",
                            filterable: true,
                            dicData:[],
                            dataType: 'string',
                            search: true,
                            overHidden: true,
                            sortable: true,
                            width:160,
                        },
                        {
                            label: "Country",
                            prop: "nation",
                            type: "input",
                            overHidden: true,
                            sortable: true,
                            width:140,
                        },{
                            label: "PC Qty",
                            prop: "prodNum",
                            type: "input",
                            overHidden: true,
                            sortable: true,
                            width:130,
                        },
                        {
                            label: "Anwise Stock",
                            prop: "anwiseStock",
                            type: "input",
                            overHidden: true,
                            sortable: true,
                            width:170,
                        },
                        {
                            label: "Total Stock",
                            prop: "totalStock",
                            type: "input",
                            overHidden: true,
                            sortable: true,
                            width:130,
                        },{
                            label: "Description",
                            prop: "materialDesc",
                            type: "input",
                            // hide: true,
                            overHidden: true,
                            sortable: true,
                            width:150,
                        }, {
                            label: "Ship To",
                            prop: "facName",
                            type: "input",
                            search: true,
                            overHidden: true,
                            sortable: true,
                            width:150,
                        },
                        {
                            label: "Address",
                            prop: "facAddr",
                            type: "input",
                            // hide: true,
                            overHidden: true,
                            sortable: true,
                            width:200,
                        },
                        {
                            label: "Contact Person",
                            prop: "contact",
                            type: "input",
                            // hide: true,
                            overHidden: true,
                            sortable: true,
                            width:160,
                        },
                        {
                            label: "Sales model",
                            prop: "salesType",
                            type: "select",
                            filterable: true,
                            search: true,
                            dicUrl: '/api/blade-system/dict-biz/dictionary?code=sales_type',
                            props: {
                                label: 'dictValue',
                                value: 'dictKey',
                            },
                            dataType: 'string',
                            display:'false',
                            rules: [{
                                required: false,
                                message: "请输入销售方式",
                                trigger: "blur"
                            }],
                        },{
                            label: "Price Term",
                            prop: "tradeTerms",
                            type: 'select',
                            filterable:true,
                            dicUrl: '/api/blade-system/dict-biz/dictionary?code=trade_terms',
                            props: {
                                label: 'dictValue',
                                value: 'dictKey',
                            },
                            dataType: 'string',
                            search: true,
                            overHidden: true,
                            sortable: true,
                            width:150,
                        },{
                            label: "Ship Mode",
                            prop: "tansportModes",
                            type: "select",
                            filterable: true,
                            dicUrl: "/blade-system/dict-biz/dictionary?code=tansport_modes",
                            props: {
                                label: 'dictValue',
                                value: 'dictKey',
                            },
                            dataType: 'string',
                            search: true,
                            overHidden: true,
                            sortable: true,
                            width:150,
                        },

                        {
                            label: "Payment Term",
                            prop: "paymentTerms",
                            type: "input",
                            // hide: true,
                            overHidden: true,
                            sortable: true,
                            width:150,
                        }, {
                            label: "Sales Remark",
                            prop: "salesRemark",
                            type: "input",
                            // search: true,
                            overHidden: true,
                            width:140,
                        },{
                            label: "Item Remark",
                            prop: "remark",
                            type: "input",
                            overHidden: true,
                            sortable: true,
                            width:140,
                        },{
                            label: "Production Remark",
                            prop: "orderRemark",
                            type: "input",
                            // search: true,
                            overHidden: true,
                            width:200,
                        }, {
                            label: "Order Closed",
                            prop: "deliComplete",
                            type: "select",
                            dicUrl: "/blade-system/dict-biz/dictionary?code=biz_yes_no",
                            filterable: true,
                            overHidden: true,
                            sortable: true,
                            props: {
                                label: 'dictValue',
                                value: 'dictKey',
                            },
                            dataType: 'string',
                            search: true,
                            width:150,
                        },
                      {
                        label: "Produce Complete",
                        prop: "prodComplete",
                        type: "select",
                        dicUrl: "/blade-system/dict-biz/dictionary?code=biz_yes_no",
                        filterable: true,
                        overHidden: true,
                        sortable: true,
                        props: {
                          label: 'dictValue',
                          value: 'dictKey',
                        },
                        dataType: 'string',
                        search: true,
                        width:150,
                      },
                      {
                            label: "Discrepancy",
                            prop: "discrepancy",
                            type: "select",
                            dicData:[{
                                label:'Yes',
                                value:'Yes'
                            }, {
                                label:'No',
                                value:'No'
                            }],
                            html:true,
                            formatter:(row, value, column)=>{
                              console.log(row)
                              if (row.checkMasterPrice==row.checkPriceNum) {
                                return 'No';
                              } else {
                                return '<span style="color:red">'+'Yes'+'</span>';
                              }
                            },
                            search: true,
                            overHidden: true,
                            width:150,
                        },{
                            label: "Master Price",
                            prop: "checkMasterPrice",
                            type: "input",
                            // search: true,
                            overHidden: true,
                            width:150,
                        }

                        // {
                        //     label: "预交日期",
                        //     prop: "salesDate",
                        //     type: "input",
                        //     search: true,
                        //     overHidden: true,
                        //     sortable: true,
                        //     width:140,
                        // },
                        // {
                        //     label: "最近一次出货日期",
                        //     prop: "deliCompDate",
                        //     type: "input",
                        //     overHidden: true,
                        //     sortable: true,
                        //     width:140,
                        // },






                        // {
                        //     label: "寄出日期",
                        //     prop: "deliCompDate",
                        //     type: "input",
                        //     // search: true,
                        //     overHidden: true,
                        //     width:140,
                        // },


                        // {
                        //     label: "备货数量",
                        //     prop: "stockNum",
                        //     type: "input",
                        //     // search: true,
                        //     overHidden: true,
                        //     width:140,
                        // },
                        // {
                        //     label: "付款方式",
                        //     prop: "rmb",
                        //     type: "input",
                        //     // search: true,
                        //     overHidden: true,
                        //     width:140,
                        // },

                        // {
                        //     label: "人为订单完成操作者",
                        //     prop: "createUserName",
                        //     type: "input",
                        //     // hide: true,
                        //     search:true,
                        //     overHidden: true,
                        //     sortable: true,
                        //     width:140,
                        // },
                        // {
                        //     label: "人为订单完成操作日期",
                        //     prop: "createTime",
                        //     type: "input",
                        //     // hide: true,
                        //     overHidden: true,
                        //     sortable: true,
                        //     width:150,
                        // },
                        // {
                        //     label: "人为排产已完成操作者",
                        //     prop: "createUserName",
                        //     type: "input",
                        //     // hide: true,
                        //     search:true,
                        //     overHidden: true,
                        //     sortable: true,
                        //     width:140,
                        // },
                        // {
                        //     label: "人为排产已完成操作日期",
                        //     prop: "createTime",
                        //     type: "input",
                        //     // hide: true,
                        //     overHidden: true,
                        //     sortable: true,
                        //     width:150,
                        // },



                    ]
                },
                data: []
            };
        },
        computed: {
            ...mapGetters(["permission"]),
            permissionList() {
                return {
                    checkPriceBtn: this.validData(this.permission.order_check_price, false),
                    viewBtn: this.validData(this.permission.order_details_view, false),
                };
            },
            ids() {
                let ids = [];
                this.selectionList.forEach(ele => {
                    ids.push(ele.id);
                });
                return ids.join(",");
            }
        },
        mounted() {
          this.$nextTick(() => {
            this.selectDicData();
          })
        },
        methods: {
            selectDicData() {
              selectCustomerGroup().then(res => {
                this.programCodeSelect = res.data.data;
                let dicList=[];
                this.programCodeSelect.forEach(res=>{
                  let dic={};
                  dic.label = res.programName;
                  dic.value = res.programName;
                  dicList.push(dic);
                })
                const column =  this.findObject(this.option.column, 'programName');
                console.log(dicList)
                column.dicData = dicList;
              })
            },
            handleView(row){
                let title="查看订单进度";
                this.$refs.orderProgress.showSelect(row, title)
            },
            handleExport(){
                NProgress.start();
                this.query.checkPrice = this.permissionList.checkPriceBtn;
                exportBlob(
                    `/blade-/anwise/order/order_item/export?${this.website.tokenHeader
                    }=${getToken()}`, this.query
                ).then(res => {
                    downloadXls(res.data, `订单明细${this.$dayjs().format('YYYYMMDDHHmmss')}.xlsx`);
                    NProgress.done();
                });
            },
            rowSave(row, done, loading) {
                add(row).then(() => {
                    this.onLoad(this.page);
                    this.$message({
                        type: "success",
                        message: "操作成功!"
                    });
                    done();
                }, error => {
                    loading();
                    window.console.log(error);
                });
            },
            rowUpdate(row, index, done, loading) {
                update(row).then(() => {
                    this.onLoad(this.page);
                    this.$message({
                        type: "success",
                        message: "操作成功!"
                    });
                    done();
                }, error => {
                    loading();
                    window.console.log(error);
                });
            },
            rowDel(row) {
                this.$confirm("确定将选择数据删除?", {
                    confirmButtonText: "确定",
                    cancelButtonText: "取消",
                    type: "warning"
                })
                    .then(() => {
                        return remove(row.id);
                    })
                    .then(() => {
                        this.onLoad(this.page);
                        this.$message({
                            type: "success",
                            message: "操作成功!"
                        });
                    });
            },
            handleDelete() {
                if (this.selectionList.length === 0) {
                    this.$message.warning("请选择至少一条数据");
                    return;
                }
                this.$confirm("确定将选择数据删除?", {
                    confirmButtonText: "确定",
                    cancelButtonText: "取消",
                    type: "warning"
                })
                    .then(() => {
                        return remove(this.ids);
                    })
                    .then(() => {
                        this.onLoad(this.page);
                        this.$message({
                            type: "success",
                            message: "操作成功!"
                        });
                        this.$refs.crud.toggleSelection();
                    });
            },
            summaryMethod ({ columns, data }) {
                const sums = [];
                if (columns.length > 0) {
                    sums[0] = '合计：';
                    columns.forEach((column, index) => {
                        let prop = column.property
                        if (['num','checkTotalPrice','deliNum','needNum','totalCtn','totalGw','packSize','packSizeCbm','asnNum','unAsnNum'].includes(prop)) {
                            let values = data.map(item => Number(item[prop] || 0));
                            let all = values.length !== 0 ? sums[index] = values.reduce((a, b) => {
                                return a + b;
                            }) : 0
                            if (['num','deliNum','needNum','totalCtn','asnNum','unAsnNum'].includes(prop)) {
                                sums[index] = this.$toFixed(all,0)
                            }
                            if(prop=='checkTotalPrice') {
                                sums[index] = this.$toFixed(all,2)
                            }
                            if(prop=='totalGw') {
                                sums[index] = this.$toFixed(all,2)
                            }
                            if(prop=='packSize') {
                                sums[index] = this.$toFixed(all,4)
                            }
                            if(prop=='packSizeCbm') {
                                sums[index] = this.$toFixed(all,2)
                            }
                        }
                    });
                }
                return sums;
            },
            beforeOpen(done, type) {
                if (["edit", "view"].includes(type)) {
                    getDetail(this.form.id).then(res => {
                        this.form = res.data.data;
                    });
                }
                done();
            },
            searchReset() {
                this.query = {};
                this.salesDateRange = [];
                this.search.salesDateStart = '';
                this.search.salesDateEnd = '';
                this.onLoad(this.page);
            },
            searchChange(params, done) {
                this.query = params;
                // Object.assign(this.query, params)
                this.page.currentPage = 1
                this.onLoad(this.page, params);
                done();
            },
            sortChange(val) {
                console.log(val)
                this.sort = {
                    prop: val.prop,
                    order: val.order
                };
                let order = "";
                if (this.sort.prop && this.sort.order) {
                    if (this.sort.order === "descending") {
                        order = `${this.sort.prop} desc`
                    } else {
                        order = `${this.sort.prop} asc`
                    }
                }
                this.query.orderBy = order;
                this.onLoad(this.page);
            },
            selectionChange(list) {
                this.selectionList = list;
            },
            selectionClear() {
                this.selectionList = [];
                this.$refs.crud.toggleSelection();
            },
            currentChange(currentPage){
                this.page.currentPage = currentPage;
            },
            sizeChange(pageSize){
                this.page.pageSize = pageSize;
            },
            refreshChange() {
                this.onLoad(this.page, this.query);
            },
            onLoad(page, params = {}) {
                this.loading = true;
                console.log(this.permissionList.checkPriceBtn)
                params.checkPrice = this.permissionList.checkPriceBtn;
                orderDetails(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
                    const data = res.data.data;
                    this.page.total = data.total;
                    this.data = data.records;
                    this.loading = false;
                    this.selectionClear();
                });
            },
            handleDateChange(value) {
                if (value) {
                    this.search.salesDateStart = value[0];
                    this.search.salesDateEnd = value[1];
                } else {
                    this.search.salesDateStart = '';
                    this.search.salesDateEnd = '';
                }
            }
        }
    };
</script>

<style>
    .row-yellow {
        background-color: rgb(255, 253, 230) !important;
        cursor: pointer;
    }

    input::-webkit-outer-spin-button,
    input::-webkit-inner-spin-button{
        -webkit-appearance: none !important;
        margin: 0;
    }
</style>
